<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <title>myapp</title>
    <style media="screen">
      *{
        padding:0;
        margin: 0
      }
    </style>
  </head>
  <body>
    <div id="app">
      <router-view></router-view>
    </div>
    <!-- built files will be auto injected -->
  </body>
  <script type="text/javascript">
  /* 因为我们后面用的是rem布局，所以这里做下处理，根据不用设备分辨率更改跟字体大小。 rem相关布局[请参考](http://www.jianshu.com/p/65f80d4b44bb)*/
    (function(win,doc){
          change();
          function change(){
              doc.documentElement.style.fontSize = doc.documentElement.clientWidth *20/320+'px';
          }
          win.addEventListener('resize',change,false);
          win.addEventListener('orientationchange',change,false);  /* 这个是移动端设备横屏、竖屏转换时触发的事件处理函数 */
      })(window,document);
  </script>
</html>
